input type=file 选择文件路径获取方法

您所在的位置：网站首页 › html 选择文件夹 › input type=file 选择文件路径获取方法

input type=file 选择文件路径获取方法

#input type=file 选择文件路径获取方法| 来源: 网络整理| 查看: 265

input file上传按钮选择文件后的value是无法直接获取到的，本文借用js方法获取file选中文件的物理路径和文件名

代码如下：

DOM结构：

点击这里上传文件选择文件

CSS样式：

.a-upload { padding: 4px 10px; height: 20px; line-height: 20px; position: relative; cursor: pointer; color: #888; background: #fafafa; border: 1px solid #ddd; border-radius: 4px; overflow: hidden; display: inline-block; *display: inline; *zoom: 1 } .a-upload input { position: absolute; font-size: 100px; right: 0; top: 0; opacity: 0; filter: alpha(opacity=0); cursor: pointer } .a-upload:hover { color: #444; background: #eee; border-color: #ccc; text-decoration: none } .file { position: relative; display: inline-block; background: #D0EEFF; border: 1px solid #99D3F5; border-radius: 4px; padding: 4px 12px; overflow: hidden; color: #1E88C7; text-decoration: none; text-indent: 0; line-height: 20px; } .file input { position: absolute; font-size: 100px; right: 0; top: 0; opacity: 0; } .file:hover { background: #AADFFD; border-color: #78C3F3; color: #004974; text-decoration: none; }

获取file选择文件名方法

this.files[0].name 获取file选择文件物理路径方法 document.getElementById('fileField').value

【本文地址】

input type=file 选择文件路径获取方法

input type=file 选择文件路径获取方法

今日新闻

推荐新闻